<template>
  <div>
    <el-tooltip
      class="item"
      effect="dark"
      content="回到首页"
      placement="right-start"
    >
      <div class="AppImgBox" ref="ImgBox">
        <img
          class="img1"
          @click="AppImg"
          ref="AppImg"
          src="@/assets/image/index/无想.png"
          alt=""
        />
      </div>
    </el-tooltip>
    <div class="leishen">
      <!-- <img src="@/assets/image/index/bwp_10de555.gif" alt="" /> -->
    </div>
    <!-- <img class="leishen" src="@/assets/image/index/雷神2.png" alt="" /> -->
  </div>
</template>

<script>
export default {
  name: 'AppImg',
  data() {
    return {}
  },
  methods: {
    AppImg() {
      this.$router.push('/')
    }
  }
}
</script>

<style lang="less" scoped>
.leishen {
  position: fixed;
  left: 0%;
  bottom: 0;
  width: 1200px;
}
.AppImgBox {
  position: fixed;
  z-index: 999;
  right: 60px;
  bottom: -100px;
  width: 110px;
  height: 410px;
  // background-color: #333;
  overflow: hidden;
  cursor: pointer;
  transition: all;
  .img1 {
    z-index: 999;
    position: absolute;
    right: 0;
    width: 110px;
  }
}
.AppImgBox:hover {
  animation: seover 0.5s;
  animation-fill-mode: forwards;
}
@keyframes seover {
  100% {
    // width: 600px;
    bottom: -22px;
  }
}
</style>
